// 引入 unocss 及其预设
import { defineConfig, presetUno, presetAttributify, presetIcons } from 'unocss'

// 使用 defineConfig 定义 unoCSS 的配置
export default defineConfig({
    // 预设集合，包含基础样式、属性化语法和图标支持
    presets: [
        presetUno(), // UnoCSS 默认基础原子化样式
        presetAttributify(), // 支持通过属性的方式使用原子类
        presetIcons({
            scale: 1.2, // 图标缩放比例为 1.2
            warn: true // 使用图标时如果有警告则输出警告信息
        })
    ],
    // 自定义规则，可以扩展原子类
    rules: [
        ['m-1', { margin: '0.25rem' }] // 自定义 m-1 类，设置 margin 为 0.25rem
    ],
    // 快捷类名，便于复用和维护
    shortcuts: {
        'btn': 'py-2 px-4 font-semibold rounded-lg shadow-md', // btn 快捷类，常用按钮样式
        'btn-primary': 'btn bg-blue-500 text-white hover:bg-blue-700' // btn-primary 快捷类，主按钮样式，包含 btn 基础样式和主色
    },
    // 主题配置，可以自定义颜色、字体等
    theme: {
        colors: {
            primary: 'var(--primary-color)', // 主色，使用 CSS 变量
            secondary: 'var(--secondary-color)' // 次色，使用 CSS 变量
        }
    }
})